<template>
	<view class="dialog-bg" @tap="close()">
		<view class="dialog-body" @tap.stop="">
			<view class="dialog-header">
				<view class="dialog-name">{{title}}</view>
				<view><i class="icon" @tap="close()">&#xe634;</i></view>
			</view>
			<view class="dialog-content">
				<slot></slot>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		props:{title :{}},
		methods:{
			close(){
				this.$emit('close')
			}
		}
		
	}
</script>

<style>
	.dialog-bg{position: fixed;width: 100%;height: 100%;background: rgba(0,0,0,0.3);top:0;left:0;z-index: 9;overflow: hidden;}
	.dialog-body{width: 90%;padding:20upx;background: #FFFFFF;border-radius: 10upx;margin:200upx auto;}
	.dialog-header{width: 100%;height: 40upx;position: relative;overflow: hidden;}
	.dialog-header i{float: right;}
	.dialog-name{float: left;font-weight: bold;}
</style>
